<template>
    <div class="messagelist">
        <div class="content">
            <div class="inputs">
                <div class="input-text">输入原密码</div>
                <van-field class="isinput" type="password" v-model="comePassword" placeholder="请输入原密码" />
            </div>
            <div class="inputs">
                <div class="input-text">设置新密码</div>
                <van-field class="isinput" type="password" v-model="newPassword" placeholder="请输入新密码" />
            </div>
            <div class="inputs">
                <div class="input-text">确认新密码</div>
                <van-field class="isinput" type="password" v-model="againNew" placeholder="请再次输入新密码" />
            </div>
            <button class="saveBtn" @click="getAmendPwd">保存</button>
        </div>
    </div>
</template>

<script>
import { Toast,Field,Dialog  } from 'vant';
import {getAmendPwd} from '@/api/me'
export default {
    name:'amendPassword',
    //声明组件
    components:{
        [Field.name]:Field,
        [Toast.name]:Toast,
        [Dialog.name]:Dialog
    },
    data(){
        return {
            token:'',//登录用户的token
            comePassword:'',//原密码
            newPassword:'',//新密码
            againNew:'',//确认新密码
        }
    },
    created(){
       //获取token
       if(this.$route.query.token){
           this.token = this.$route.query.token;
       }
    },
    methods:{
        //修改密码
        getAmendPwd(){
            if(this.comePassword == ''){
                Toast('请输入原密码'); return false;
            }else if(this.newPassword == ''){
                Toast('请输入新密码'); return false;
            }else if(this.againNew == ''){
                Toast('请再次输入新密码'); return false;
             }else if(this.againNew != this.newPassword){
                Toast('确认密码输入错误！'); return false;
            }else {
                getAmendPwd(this.token,this.comePassword,this.againNew).then(res => {
                    if(res.code == 200){
                        //跳转提交审核页面
                        let para = {};
                        para.title = '保存成功';
                        para.url = '/amendSuccess';
                        this.interaction.hLink(para);
                    }else if(res.code ==403){
                        Dialog.alert({
                            title: '提示',
                            message: '您的账号被挤下线，请重新登录',
                            confirmButtonText:'去登陆'
                        }).then(() => {
                            //跳转原生登录
                            let para = {};
                            para.linkType = "login";
                            this.interaction.hLinkToApp(para);
                        });
                    }else{
                        Toast(res.msg);
                    }
                })
            }
        },
        
    }
}

</script>

<style lang="stylus" scoped>
 .messagelist{
    width :100%;
    height :100%;
    .content{
        padding:.266667rem;
        .inputs {
            margin-top :.266667rem;
            margin-bottom :.666667rem;
            .input-text {
                font-size :.373333rem;
                color :#A2A2A2;
            }
            .isinput {
                font-size :.373333rem;
                height :1.066667rem;
                background:#f1f1f1;
                border-radius :.16rem;
                margin-top :.266667rem;
                margin-bottom :.266667rem;
            }
        }
        .saveBtn {
            width :100%;
            height :.933333rem;
            background:#1c90ff;
            border-radius :.16rem;
            color:#ffffff;
            font-size :.426667rem;
            margin-top :.8rem;
        }
    }
       
}    
</style>